<!doctype html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
</head>
<body>
<div id="currentContainer" ng-controller="maintenanceTenderCtrl"> 
    <!-- confirmation popup include -->
    <div th:include="components/confirmation/delete"></div>
    <div class="panel panel-default">
        <div class="panel-heading">
            <h3 class="panel-title" th:text="#{accounting.dashboard.title.tender}"><i class="fa fa-filter icon-border-left"></i><strong>Edit Tender Values</strong></h3>
        </div>
        
        <div class="col-md-12 legend-block">
			<span class="legend-title">Legend:</span>
				<div class="row">
				<div class="col-md-6">
					<ul class="legend-info">
					<li><strong>Code:</strong> Tender Code  assigned by Accounting Dept.</li>
					<li><strong>Description:</strong> Tender Name/description.</li>								
					</ul>
				</div>
				<div class="col-md-6">
					<ul class="legend-info">
     				<li><strong>ExternalCode:</strong> Code sent internally between I2 system modules to identify the monetary_id which the transaction was made.</li>
					<li><strong>Priority:</strong> Internally set in order to accomplish the transaction amount tender distribution logic.</li>
					</ul>
				</div>
				</div>
		</div>
		        
        <div class="container-fluid panel-body">
            <div class="alert alert-danger" ng-show="errorResponse"> <strong>{{errorResponse.code}} : {{errorResponse.message}}</strong>
                <ul ng-repeat="error in errorResponse.errors">
                    <li>{{error.code}} : {{error.message}}</li>
                </ul>
            </div>
            <div class="alert alert-success" ng-show="successResponse"> <strong>SUCCESS: {{successResponse}}</strong> </div>
            <button type="button" class="btn btn-primary" id="add-row" ng-click="addTender()" th:text="#{accounting.dashboard.addRow}"><i class="fa fa-plus-circle" style="margin-right:8px; font-size:14px;"></i>Add Row</button>
            <div class="form-group" style="float: right;">
                <select class="form-control input-sm" id="pageSizeSelectId" ng-model="pageSize" ng-options="s for s in pageSizes">
                </select>
            </div>
            <div class="x-marg-bot maintenance-table">
                <table class="table table-striped table-bordered table-hover table-condensed" >
                    <thead>
                        <tr>
                            <th class="cb-col"><label>
                                    <input role="checkbox" type="checkbox" class="cb" name="" aria-checked="false">
                                    </input>
                                    <span class="lbl align-top"></span></label>
                            </th>
                            <th class="action-col" th:text="#{accounting.dashboard.label.actions}"><span>Actions</span></th>
                            <th><span th:text="#{accounting.dashboard.code}">Code</span></th>
                            <th><span th:text="#{accounting.dashboard.description}">Description</span></th>
                            <th><span th:text="#{accounting.dashboard.externalCode}">External Code</span></th>
                            <th><span th:text="#{accounting.dashboard.column.priority}">Priority</span></th>
                        </tr>
                    </thead>
                    <tbody>
                        <tr ng-repeat="tender in gridRecords">
                            <td class="cb-col"><label>
                                    <input role="checkbox" type="checkbox" class="cb">
                                    </input>
                                    <span class="lbl align-top"></span> </label></td>
                            <td style="white-space: nowrap"><!-- form -->
                                
                                <form editable-form="" name="rowform" ng-show="rowform.$visible" class="form-buttons form-inline" onbeforesave="saveOrupdateEntity($data, tender.id)" oncancel="cancelSaving($index, tender.id)" shown="inserted == tender">
                                    <div ng-disabled="rowform.$waiting" ng-click="rowform.$submit()" class="ui-pg-div ui-inline-icon" data-original-title="Save"><span class="ui-icon ui-icon-disk"></span></div>
                                    <div ng-disabled="rowform.$waiting" ng-click="rowform.$cancel()" class="ui-pg-div ui-inline-icon" data-original-title="Cancel"><span class="ui-icon ui-icon-cancel"></span></div>
                                </form>
                                <div class="buttons" ng-show="!rowform.$visible">
                                    <div ng-click="rowform.$show()" class="ui-pg-div ui-inline-icon" data-original-title="Edit selected row"><span class="ui-icon ui-icon-pencil"></span></div>
                                    <div ng-click="showModalDeletionConfirmation(tender.id, 'deletionConfirmationDivId', 'Tender: ' + tender.code)" class="ui-pg-div ui-inline-icon" data-original-title="Delete selected row"><span class="ui-icon ui-icon-trash"></span></div>
                                </div></td>
                            <td><span editable-text="tender.code" e-name="code" e-form="rowform" e-maxlength="50" onbeforesave="validateCode('Code', $data)"> {{tender.code || 'empty'}} </span></td>
                            <td><span editable-text="tender.description" e-name="description" e-form="rowform" e-maxlength="100" onbeforesave="validateDescription('Description', $data)"> {{tender.description || 'empty'}} </span></td>
                            <td><span editable-text="tender.externalCode" e-name="externalCode" e-form="rowform" e-maxlength="50" onbeforesave="validateExternalCode('ExternalCode', $data)"> {{tender.externalCode || 'empty'}} </span></td>
                            <td><span editable-text="tender.priority" e-name="priority" e-form="rowform" e-maxlength="11" onbeforesave="validatePriority('Priority', $data)"> {{tender.priority || 'empty'}} </span></td>
                        </tr>
                    </tbody>
                </table>
            </div>
            <div class="row">
                <div class="col-md-3">
                    <div><span th:text="#{accounting.dashboard.label.showing}">Showing</span> {{((currentPage - 1) * pageSize) + 1}} <span th:text="#{accounting.dashboard.label.to}">to</span> {{getPagedUpperLimit()}} <span th:text="#{accounting.dashboard.label.of}">of</span> {{totalItems}} <span th:text="#{accounting.dashboard.label.entries}">entries</span></div>
                </div>
                <div class="col-md-9" style="text-align:right;">
                    <pagination page="currentPage" items-per-page="pageSize" total-items="totalItems" class="pagination" boundary-links="true" num-pages="numPages" max-size="maxSize" rotate="false"></pagination>
                </div>
            </div>
        </div>
    </div>
</div>
<script src="/resources/js/bootstrap/bootstrap.min.js" th:src="@{/resources/js/bootstrap/bootstrap.min.js}"></script>
</body>
</html>